<template>
  <div class="v_password">
    <el-form :model="pwdForm" :rules="pwdRules" ref="pwdForm" label-width="110px" class="accountSet">
      <el-form-item label="原密码" prop="orgPwd" size="mini">
        <el-input type="password" v-model="pwdForm.orgPwd" placeholder="请输入原密码" maxlength="30"></el-input>
      </el-form-item>
      <el-form-item label="新密码" prop="newPwd"  size="mini">
        <el-input type="password" v-model="pwdForm.newPwd" placeholder="请输入新密码" maxlength="30"></el-input>
      </el-form-item>
      <el-form-item label="确认密码" prop="confirmPwd"  size="mini">
        <el-input type="password" v-model="pwdForm.confirmPwd" placeholder="请再次输入密码"></el-input>
      </el-form-item>
      <el-form-item  size="mini">
        <el-button type="primary" @click="submit('pwdForm')" class="primary-button">确定</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
  import {commonService} from '../../service/commonService' 

  export default {
    props: [],
    data () {
      var validatePass = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请输入新密码'));
        }
        else if (value.length < 6 || value.length > 30) {
          callback(new Error('长度在 6 到 30 个字符'));
        }
        else{
          callback();
        }
      };
      var validatePass2 = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请再次输入密码'));
        } else if (value !== this.pwdForm.newPwd) {
          callback(new Error('两次输入密码不一致!'));
        } else {
          callback();
        }
      };
      return {
        pwdForm: {
          orgPwd: '',
          newPwd: '',
          confirmPwd: ''
        },
        pwdRules: {
          orgPwd: [
            { required: true, message: '请输入原密码', trigger: 'blur' }
          ],
          newPwd: [
            { validator: validatePass, trigger: 'blur' }
          ],
          confirmPwd: [
            { validator: validatePass2, trigger: 'blur' }
          ],
        },
      }
    },
    components: {},
    mounted () {},
    methods: {
      submit(formName){
        let that=this;
        that.$refs[formName].validate((valid) => {
          if (valid) { // 验证成功
            commonService.putPasswordspasswords({oldPassword: that.pwdForm.orgPwd, newPassword: that.pwdForm.newPwd}).then(function (res) {
//              // 旧密码和新密码相同，请重新输入 两次密码输入不相同，请重新输入
              if (res.data.success) {
                that.$message({
                  type: 'success',
                  message: "修改密码成功"
                });
                localStorage.token = ''; // 清空token
                that.$router.replace({name: 'login'}); // 跳转到登录页
              } else {
                that.$message.error(res.data.message);
              }
            });
          }
        });
      },
    }
  }
</script>
<style lang="less" scoped>
 .v_password{
   padding-top: 15px;
 	.accountSet{width: 600px;}
  .reset-pwd{margin-left: 20px; color: #409EFF; font-size: 12px; cursor: pointer;}
 }
  
</style>